<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			// 扩展运算符（spread）是三个点（...）
			console.log([1, 2, 3]); //打印数组对象本身
			console.log(...[1, 2, 3]); //打印数组内容

			// 数组克隆
			// 以前
			const a1 = [1, 2];
			const a2 = a1.concat();
			// 现在，下的两种写法，a3，a4都是a1的克隆
			const a3 = [...a1];
			const [...a4] = a1;

			// 数组合并（注意，两种方法都是浅拷贝）
			const arr1 = ['a', 'b'];
			const arr2 = ['c'];
			const arr3 = ['d', 'e'];
			// ES5 的合并数组
			arr1.concat(arr2, arr3); // [ 'a', 'b', 'c', 'd', 'e' ]
			// ES6 的合并数组
			[...arr1, ...arr2, ...arr3] // [ 'a', 'b', 'c', 'd', 'e' ]

			// 特殊用法
			// ES5 的写法
			Math.max.apply(null, [14, 3, 77])
			// ES6 的写法
			Math.max(...[14, 3, 77])
			// 字符串
			[...'hello'] // [ "h", "e", "l", "l", "o" ]
			// 上面的写法，有一个重要的好处，那就是能够正确识别四个字节的 Unicode 字符
			'x\uD83D\uDE80y'.length // 4
				[...'x\uD83D\uDE80y'].length // 3

			// 任何定义了遍历器，都可以用扩展运算符转为真正的数组
			let map = new Map([
				[1, 'one'],
				[2, 'two'],
				[3, 'three'],
			]);
			let arr = [...map.keys()]; // [1, 2, 3]

			// arrayLike是一个类似数组的对象，但是没有部署 Iterator 接口，扩展运算符就会报错
			// 这时，可以改为使用Array.from方法将arrayLike转为真正的数组
			let arrayLike = {
				'0': 'a',
				'1': 'b',
				'2': 'c',
				length: 3
			};
			let arr = [...arrayLike]; // TypeError: Cannot spread non-iterable object.
			// ES5的写法
			var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']
			// ES6的写法
			let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

			// 此外Array对象还增加了不少方法
			// Array.of方法用于将一组值，转换为数组
			// fill方法使用给定值，填充一个数组
			// entries()，keys()和values()——用于遍历数组
			// ......
		</script>
	</body>
</html>
